<template>
  <div>
    <Head :title="pageOpt.type" :icon="pageOpt.icon"></Head>
    <van-search
      placeholder="请输入搜索关键词"
      @click-input="router.push('/search')"
    />
    <QuestionList :list="list" />
  </div>
</template>
<script setup lang="ts">
import { ref, watch } from 'vue';
import listData from '@/assets/listData/index.js';
import { useRoute, useRouter } from 'vue-router';
const router = useRouter();
const route = useRoute();
let pageType: string = route.query.type || 'rearing';
const pageOpt = ref<Child>();
const list = ref<DataList[]>();
function updatePage() {
  listData.map((items: List) => {
    items.children.map((item: Child) => {
      if (item.prop === pageType) {
        pageOpt.value = item;
        list.value = item.data;
      }
    });
  });
}
updatePage();
watch(route, () => {
  pageType = route.query.type;
  updatePage();
});
</script>
<style scoped lang="scss">
.search-icon {
  font-size: 16px;
  line-height: inherit;
}
</style>
